<template>
	<view class="root">
		<view class="c1-list">
			<view class="list" @click="goToShopIntroduce">
				 <view>
				  <image src="../../static/007.jpg" mode="" class="img"></image>
				 </view>
				 <view class="title">
				 	<text>书画课程</text>
				 </view>
				 <view class="content">
				 	<text>一对一 固定时段</text>
				 </view>
			</view>
			<view class="list" @click="goToShopIntroduce">
				 <view>
				 <image src="../../static/007.jpg" mode="" class="img"></image>
				 </view>
				 <view class="title">
				 	<text>国画课程</text>
				 </view>
				 <view class="content">
				 	<text>一对一 固定时段</text>
				 </view>
			</view>
		</view>
		<view class="c1-list">
			<view class="list" @click="goToShopIntroduce">
				 <view>
				 <image src="../../static/007.jpg" mode="" class="img"></image>
				 </view>
				 <view class="title">
				 	<text>高考美术课程</text>
				 </view>
				 <view class="content">
				 	<text>一对一 固定时段</text>
				 </view>
			</view>
			<view class="list" @click="goToShopIntroduce">
				 <view>
				 	 <image src="../../static/007.jpg" mode="" class="img"></image>
				 </view>
				 <view class="title">
				 	<text>卡通漫画兴趣课程</text>
				 </view>
				 <view class="content">
				 	<text>一对一 固定时段</text>
				 </view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				
			}
		},
		methods:{
			goToShopIntroduce(){
				uni.navigateTo({
					url:'../shopintroduce/shopintroduce'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.c1-list {
		display: flex;
		justify-content: space-between;
		width: 90%;
	} 
	
	.c1-list .list  {
		width: 346rpx;
		height: 486rpx;
		border-radius: 0 0 10rpx 10rpx;
		background-color: #fefffe;
		margin-left: 3%;
		margin-top: 20rpx;
	}
	
	.img{
		width: 346rpx;
		height: 346rpx;
		border-radius: 10rpx 10rpx 0 0;
		}
		
	.title{
		text-align: left;
		font-size: 30rpx;
		font-weight: 700;
		margin-left: 20rpx;
	}
	.content{
		text-align: left;
		font-size: 26rpx;
		margin-left: 20rpx;
		color: #949494;
	}
</style>
